<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>js</title>
		<style type="text/css">
			#div{
				width: 30px;
				height: 30px;
				background-color: blue;
			}
		</style>
	</head>

	<body>
		<div id="div" ondblclick="divClick()" onmouseenter="divjingClick()" onmouseleave="divleaveClick()"
					  onmousemove="divmoveClick()"></div>
		<!-- 单击事件 -->
		<!-- 表单 -->
		<form action="" method="post">
			账号 <input type="text" name="" id="userename" value="" onfocus="userFocus()"
						onblur="userLeave()" " /><br>
			密码 <input type="password" name="" id="password" value="" onfocus="passwordFocus()"
			onblur="passwordLeave()"/><br>
			<button type="button">提交</button>
		</form>
		<button type="button" onclick="butClick1()" >普通按钮</button>
		
		<button type="button" onclick="addListener();">添加监听器</button>
		<button type="button" onclick="removeListener();">移除监听器</button>
		
	</body>
	
	<script type="text/javascript">
	//单击
		function butClick1(){
			console.log('单击此事件')
		}
	//双击
		function divClick(){
			console.log('双击div')
		}
	//进入
		function divjingClick(){
			console.log('进入div')
			
			
		}
	//离开
		function divleaveClick(){
			console.log('离开div')
		}
	//移动
		function divmoveClick(){
			console.log('移动中')
		}
		
		//输入用户名
		function userFocus(){
			console.log('输入用户名')
		}
		//判断是否为空
		function userLeave(){
			console.log('输入完成')
			 var username = document.getElementById('username')
			 if(username.value == ''){
			 	alert('用户名不能为空');
			 	return;
			 }
			
		}
		//输入密码
		function userFocus(){
			console.log('输入密码')
		}
		//判断是否为空
		function userLeave(){
			console.log('输入完成')
			 var username = document.getElementById('username')
			 if(username.value == ''){
			 	alert('密码不能为空');
			 	return;
			 }
			
		}
		
	
		function addListener(){
			document.getElementById('div5').addEventListener('mousemove',div5move)
			alert('监听器添加成功')
		}
		function removeListener(){
			document.getElementById('div5').removeEventListener('mousemove',div5move)
			alert('监听器移除成功')
		}
		
	</script>
</html>
